import React, { Component } from 'react';


// 引入仓库store 
import store from '../../store';
console.log('store', store);
// console.log(store.getState());
class Mystoreview extends Component {
    constructor() {
        super();
        // 将store仓里的全部数据赋值给当前组件的state
        this.state = store.getState()

        //使用store中的subscribe 方法定义store中的数据, 当store中的state 数据修改时, 会
        // 自定触发 subscribe方法, 从而实现当前组件中的state 数据的更新
        // store.subscribe(() => {
        //     console.log('你变了');
        //     this.setState(() => {
        //         return store.getState()
        //     })
        // })

        // 以上简化
        store.subscribe(() => this.setState(() => store.getState()))
    }
    render() {
        return (
            <div>
                <p>store仓库中count:{this.state.count}</p>
                <p><button onClick={this.addCount}>count++</button></p>
                <p>store仓库中money:{this.state.money}</p>
                <p><button onClick={this.addMoney}>money++</button></p>
            </div>
        );
    };

    addCount = () => {
        // 调用store 对象上的dispatch 方法 派发action任务, 然后交给reducer处理函数,进而修改state
        store.dispatch({ type: '+', payload: 1 })
    }

    addMoney = () => {
        // 调用store 对象上的dispatch 方法 派发action任务, 然后交给reducer处理函数,进而修改state
        store.dispatch({ type: 'add' })
    }
}

export default Mystoreview;
